// 路由守卫
// 导入 router 实例
import router from "@/router";
// 导入 store 实例
import store from "@/store";
// 导入 nprogress 模块(进入页面的加载提示)
import Nprogress from "nprogress";
import "nprogress/nprogress.css";

// 白名单
const whiteList = ["/login", "/404"];

// 注册全局前置守卫
router.beforeEach(async (to, from, next) => {
  // 开启进度条
  Nprogress.start();
  // 从vuex中获取token
  const { token } = store.state.user;
  if (token) {
    // 登录
    if (to.path === "/login") {
      next("/");
      Nprogress.done();
    } else {
      /**
       * 获取用户信息的action在这里调用
       * 注意:
       * 1.此项目核心在权限控制，就是不同员工登录进来看到的主页菜单不同
       * 2.如果员工登录成功了，已经跳转至主页在发请求，获取员工的角色权限已经太晚了
       * 3.这个获取员工的角色权限信息的时机是在跳转至主页之前，拿到当前员工的角色信息，知道你是谁了，
       *   有哪些权限，然后在对应的开放左侧菜单，这些操作都做完了，在让员工跳转至主页，这个时候ta所
       *   看到的左侧菜单就是ta具备的权限
       * 4.只是还不知道如何开放对应的左侧菜单
       * 这个地方代码当路由切换的时候会多次执行，会发起多次取消请求，需要优化
       *  如果没有用户信息，才发起请求
       *
       */
      // 第1种解决方式: 判断vuex中的userId有没有
      if (!store.state.user.userInfo.userId) {
        await store.dispatch("user/getUserInfoActions");
        // 这里拿到用户信息，用户信息有userInfo.roles.menus可以拿到用户角色列表
        // 这个角色列表数组的字符串表明当前员工可以看到左侧菜单栏，今后基于这个数据动态路由表
        const { menus } = store.state.user.userInfo.roles;
        // 基于当前用户信息中 roles.menus 数组来筛选动态路由表
        // 筛选的条件: 判断当前路由第一个children的名字是否在menus数绿中
        // 在的话，就留下(拥有的权限/菜单，开放)；否则就过滤掉了，舍去了（不开放）
        const otherRoutes = await store.dispatch("route/filtersRoutes", menus);
        // 把筛选的结果在动态追加到路由表中
        // router.addRoutes(路由对象数组): 同时追加多个路由规则到路由表中
        // router.addRoute(路由对象): 追加1个路由规则到路由表中
        router.addRoutes([
          ...otherRoutes,
          { path: "*", redirect: "/404", hidden: true },
        ]);

        // 刷新一下路由表
        return next({
          ...to, // next({ ...to })的目的,是保证路由添加完了再进入页面 (可以理解为重进一次)
          replace: true, // 重进一次, 不保留重复历史
        });

        //做筛选，然后在调至首页，这样首页展示的左侧菜单就是当前员工能看到的
      }
      // 第2种解决方式: 拿到action函数的返回值
      // const rsep = await store.dispatch("user/getUserInfoActions");

      // 否则放行
      next();
    }
  } else {
    // 未登录
    if (whiteList.includes(to.path)) {
      next();
    } else {
      next(`/login?redirectUrl=${to.path}`);
      Nprogress.done();
    }
  }
});
// 注册全局后置守卫
router.afterEach(() => {
  // 关闭进度条
  Nprogress.done();
});
